<template>
  <div class="help">
    <!-- 顶部标题 -->
    <div class="header">
      <van-nav-bar title="使用帮助">
        <template #right>
          <van-icon name="search" size="18" @click="showSearch" />
        </template>
      </van-nav-bar>
    </div>
    <!-- 常见问题 -->
    <div class="commonProblem">
      <van-cell-group>
        <van-cell title="常见问题" size="large" border icon="question-o" />
        <van-cell title="1.优惠券如何使用？" border @click="click" />
        <van-cell title="2.取消订单后钱什么时候到账？" border @click="click" />
        <van-cell title="3.可以固定同一个阿姨服务吗？" border @click="click" />
        <van-cell title="4.如何选择上一次服务的阿姨？" border @click="click" />
        <van-cell title="5.预约成功后在哪查看？" border @click="click" />
      </van-cell-group>
    </div>
    <van-divider />
    <!-- 更多问题 -->
    <div class="moreProblem">
      <van-cell-group>
        <van-cell title="更多问题" size="large" border icon="question-o" />
        <van-grid column-num="3">
          <van-grid-item text="订单相关" />
          <van-grid-item text="客户端使用" />
          <van-grid-item text="优惠券与活动" />
          <van-grid-item text="支付与费用" />
          <van-grid-item text="服务相关" />
        </van-grid>
      </van-cell-group>
    </div>
    <!-- 搜索弹出框 -->
    <van-popup v-model="show" position="top" :style="{ height: '8%' }">
      <form action="/">
        <van-search
          v-model="value"
          show-action
          placeholder="请输入搜索关键词"
          @search="onSearch"
          @cancel="onCancel"
        />
      </form>
    </van-popup>
  </div>
</template>

<script>
export default {
  data () {
    return {
      show: false,
      value: '',
      searchValue: ''
    }
  },
  methods: {
    showSearch () {
      this.show = true
    },
    onSearch (val, event) {
      this.searchValue = val;
      // console.log(this.searchValue);
      if (this.searchValue != undefined) {
        this.wd = this.searchValue;
        window.open("https://www.baidu.com/s?wd=" + this.wd);
      }
    },
    onCancel () {
      this.show = false
    },
    click (event) {
      // console.log(event);
      if (event.explicitOriginalTarget.data != undefined) {
        this.wd = event.explicitOriginalTarget.data;
        window.open("https://www.baidu.com/s?wd=" + this.wd);
      } else if (event.explicitOriginalTarget.innerText != undefined) {
        this.wd = event.explicitOriginalTarget.innerText;
        window.open("https://www.baidu.com/s?wd=" + this.wd);
      }
    },

  },
  computed: {

  },
  created () {

  },
};
</script>

<style scoped>
</style>